---
title: Déployez votre site Astro sur GitLab Pages
description: Comment déployer votre site Astro sur le web en utilisant GitLab Pages.
type: deploy
i18nReady: true
---

Vous pouvez utiliser [GitLab Pages](https://pages.gitlab.io/) pour héberger un site Astro pour vos projets [GitLab](https://about.gitlab.com/), vos groupes ou votre compte utilisateur.

:::tip[Vous cherchez un exemple ?]
Consultez [le projet d'exemple officiel GitLab Pages Astro](https://gitlab.com/pages/astro) !
:::

## Comment déployer

1. Définissez le bon `site` dans `astro.config.mjs`.
2. Renommez le répertoire `public/` en `static`.
2. Mettez `outDir:public` dans `astro.config.mjs`. Ce paramètre indique à Astro de placer la sortie statique de la compilation dans un dossier appelé `public`, qui est le dossier requis par GitLab Pages pour les fichiers exposés.

Si vous utilisiez le répertoire [`public/`](/fr/basics/project-structure/#public) comme source de fichiers statiques dans votre projet Astro, renommez-le et utilisez ce nouveau nom de dossier dans `astro.config.mjs` pour la valeur de `publicDir`.

Par exemple, voici les paramètres corrects de `astro.config.mjs` lorsque le répertoire `public/` est renommé en `static/` :

   ```js
   import { defineConfig } from 'astro/config';
   
   export default defineConfig({
     site: 'https://<user>.gitlab.io',
     base: '/<project-name>',
     outDir: 'public',
     publicDir: 'static',
   });
   ```

4. Créez un fichier appelé `.gitlab-ci.yml` à la racine de votre projet avec le contenu ci-dessous. Cela permettra de construire et de déployer votre site à chaque fois que vous apporterez des modifications à votre contenu :

   ```yaml
   pages:
     # L'image Docker qui sera utilisée pour construire votre application
     image: node:lts

     before_script:
       - npm ci

     script:
       # Précisez ici les étapes de la construction de votre application
       - npm run build

     artifacts:
       paths:
         # Le dossier qui contient les fichiers construits à publier.
         # Il doit être appelé "public".
         - public

     only:
       # Déclencher un nouveau build et déployer uniquement lorsqu'il y a un push sur
       # la(les) branche(s) ci-dessous
       - main
   ```
